<template>
  <BasePage>
    <!-- 头部 -->
    <BasePageHeader :title="$t('record.title')">
      <BaseBreadcrumb>
        <BaseBreadcrumbItem :title="$t('general.home')" to="home" />
        <BaseBreadcrumbItem :title="$t('record.title')" to="#" active />
      </BaseBreadcrumb>

      <template #actions>
        
      </template>
    </BasePageHeader>

    <BaseCard class="w-full mt-3">
      <!-- 左右分边，左：设备列表；右：聊天记录 -->
      <div class="grid grid-cols-3 gap-4 divide-x">
        <!-- 左：设备列表 -->
        <div class="col-span-1">
          
          <Terminals />

        </div>
        <!-- 右：聊天记录 -->
        <div class="col-span-2 p-4">

          <Records />

        </div>

      </div>
    </BaseCard>

  </BasePage>
</template>

<script setup>
import Terminals from './components/Terminals.vue'
import Records from './components/Records.vue'

</script>
